<div id="content">
<link rel="stylesheet" href="themes/${theme}/forms.css" type="text/css" />
<link type="text/css" rel="stylesheet" href="themes/${theme}/home.css" />

<script type='text/javascript' src='js/jquery.progressbar.min.js'></script>
<script type='text/javascript' src='js/utils.js.php'></script>
<script type='text/javascript' src='js/swfobject.js'></script>
<script type="text/javascript">
/* / <![CDATA[
	var so = new SWFObject("swf/amline.swf", "amline", "420", "350", "8", "#FFFFFF");
	so.addVariable("path", "swf/");
	so.addVariable("settings_file", encodeURIComponent("swf/amline_settings.xml"));
	so.addVariable("data_file", encodeURIComponent("swf/amline_data.xml"));
	so.write("flashcontent");
// ]]>
*/
</script>
<script>
$(document).ready(function() {
	$("#select").click(function() {
		if ($("#project").val() == -1 || $("#project").val() == 0) {
			alert("${err_select}");
		} else {
			$.ajax({
				type: "post",
				url: "home.php",
				data: "&project="+$("#project").val(),
				cache: "false",
				success: function(html) {
					$("#content").empty();
					$("#content").append(html);
				}
			})
		}
	}).mouseover(function(){
		$(this).css("cursor","pointer");
	});

	$("#show_projects").click(function() {
		$("#projects").toggle();
	}).mouseover(function(){
		$(this).css("cursor","pointer");
	});

	$("#show_pendings").click(function() {
		$("#pendings").toggle();
	}).mouseover(function(){
		$(this).css("cursor","pointer");
	});

	$("#show_mypendings").click(function() {
		$("#mypendings").toggle();
	}).mouseover(function() {
		$(this).css("cursor","pointer");
	});
})
</script>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
                <td class="toolbar" height="30" align="center">
		<table width="99%" border="0" cellpadding="0" cellspacing="0">
		<tr>
			<td width="60" align="right">${prj_title}:&nbsp;</td>
			<td width="180">
			<select  class="form_input" id="project">
			<option tal:repeat="prj projects" value='${prj/id_project}' tal:attributes="selected prj/selected">${prj/name}</option>
			</select>
			</td>
			<td><input type="button" id="select" class="bt_blue" Value="${bt_select}" /></td>
		</tr>
		</table>
		</td>
        </tr>
</table>
<table width="100%" border="0" cellpadding="1" cellspacing="1">
<tr>
	<td width="500" valign="top">
		<table width="100%" border="0" cellpadding="1" cellspacing="1" class="grid_main">
		<tr id="show_projects">
			<td class="grid_title">&nbsp;${prjgrid_title}</td>
		</tr>
		<tr id="projects">
			<td>
			<table width="100%" border="0" cellpadding="1" cellspacing="1" >
			<tr>
				<td class="grid_subtitle" tal:content="name" height="20"/>
				<td class="grid_subtitle" tal:content="sprints" width="60" />
				<td class="grid_subtitle" tal:content="role" width="90" />
				<td class="grid_subtitle" tal:content="progress" width="160" />
			</tr>
			<tr>
				<td colspan='4' class='item' align='center' height='20' tal:content="message" tal:condition="msg">message</td>
			</tr>
			<tr tal:repeat="project projects_grid" tal:condition="not: msg">
				<td tal:content="project/name" class="${project/class}"/>
				<td align="center" class="${project/class}"><a href="#">${project/sprint}</a></td>
				<td tal:content="project/role" align="center" class="${project/class}"/>
				<td width="160" id="progressbar_${project/id_project}" class="${project/class}">
				<script type="text/javascript">
					progressBar($('#progressbar_${project/id_project}'),${project/progress});
				</script>
				</td>
			</tr>
			</table>
			</td>
		</tr>
		<tr id="show_pendings">
			<td class="grid_title">&nbsp;${pendings_title}</td>
		</tr>
		<tr style="display: none" id="pendings">
			<td>
				asd
			</td>
		</tr>
		<tr id="show_mypendings">
			<td class="grid_title">&nbsp;${mypendings_title}</td>
		</tr>
		<tr style="display: none" id="mypendings">
			<td>
				ddddddddd
			</td>
		</tr>
		</table>
	</td>
	<td valign="top">
		<div id="flashcontent" height="400"><strong>${flash_msg}</strong></div>
	</td>
</tr>
</table>
</div>
